<template>
    <div>
        <div class="top">
            <div v-if="type==0">
                <div class="normalC">正常</div>
                <div class="text">允许通行</div>
            </div>
            <div v-else>
                <div class="normalS">发热</div>
                <div class="text">禁止通行</div>
            </div>
        </div>
        <div class="bot">
            <div class="botList clearfix">
                <div>姓名</div>
                <div>{{name}}</div>
            </div>
            <div class="botList clearfix">
                <div>科室</div>
                <div>{{hsDepartment}}</div>
            </div>
            <!-- <div class="botList clearfix" v-if="type==0 && role==2">
                <div>是否外出</div>
                <div>{{goOutValue ? '是' : '否'}}</div>
            </div> -->
            <div class="botList clearfix" v-if="type==1">
                <div>体温(℃)</div>
                <div>{{degree}}</div>
            </div>
            <div class="botList clearfix" v-if="carNum">
                <div>车牌号</div>
                <div>{{carNum}}</div>
            </div>
        </div>
        <div class="button">
            <el-button type="primary" @click="goHome" class="goHome">回到首页</el-button>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                role: '',
                type: '',
                name: '',
                hsDepartment: '',
                goOutValue: '',
                degree: '',
                carNum: ''
            }
        },
        mounted() {
            if (this.$route.query.role) this.role = this.$route.query.role
            if (this.$route.query.type) this.type = this.$route.query.type
            if (this.$route.query.name) this.name = this.$route.query.name
            if (this.$route.query.hsDepartment) this.hsDepartment = this.$route.query.hsDepartment
            if (this.$route.query.goOutValue) this.goOutValue = this.$route.query.goOutValue
            if (this.$route.query.degree) this.degree = this.$route.query.degree
            if (this.$route.query.carNum) this.carNum = this.$route.query.carNum
        },
        methods: {
            goHome() {
                this.$router.replace('/home')
            }
        }
    }
</script>

<style scoped lang="less">
    .top {
        width: 2rem;
        height: 3rem;
        margin: 1rem auto;

        .normalC {
            width: 2rem;
            height: 2rem;
            background-color: rgb(64, 196, 75);
            border-radius: 50%;
            color: #fff;
            text-align: center;
            line-height: 2rem;
            font-size: .4rem;
        }

        .normalS {
            width: 2rem;
            height: 2rem;
            background-color: rgb(238, 13, 13);
            border-radius: 50%;
            color: #fff;
            text-align: center;
            line-height: 2rem;
            font-size: .4rem;
        }

        .text {
            margin-top: .4rem;
            text-align: center;
            font-size: .36rem;
        }
    }

    .bot {
        border-top: .02rem solid rgb(245, 241, 241);
        border-bottom: .02rem solid rgb(245, 241, 241);

        .botList {
            padding: .25rem 0;
            margin: 0 0 0 .4rem;
            padding-right: .4rem;
            border-bottom: .02rem solid rgb(245, 241, 241);

            div {
                font-size: .32rem;

                &:nth-child(1) {
                    float: left;
                }

                &:nth-child(2) {
                    float: right;
                    font-weight: 700;
                }
            }

            &:last-child {
                border-bottom: none;
            }
        }
    }

    .button {
        width: 6rem;
        margin: 1rem auto;

        .goHome {
            width: 100%;
            height: .88rem;
        }
    }
</style>
